<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
  </head>
  <body>
    <script>
      // 由于GET请求、POST请求使用频率较高，jquery为了方便，专门给GET/POST封装了两个方法，方便调用。PUT/DELETE使用频率较低，没有封装。
      // 1. 发送GET请求: GET请求参数，只能在url后面使用?拼接查询字符串。
      // $.get("https://apif.java.crmeb.net/api/front/index", (data) => {
      //   console.log(data);
      // });

      // 2. 发送POST请求：可以携带请求体参数，也可以携带查询字符串。
      // $(selector).post(URL,data,function(data,status,xhr),dataType): 参数1是网址；参数2是请求体参数，有就设置没有不设置；参数3是请求成功的回调函数；
      // $.post(
      //   "https://apif.java.crmeb.net/api/front/index?a=100&b=200",
      //   (data) => {
      //     console.log(data);
      //   }
      // );

      // 3. 有参数的POST请求
      // 编码格式就是application/x-www-form-urlencoded（将键值对的参数用&连接起来，方便服务器接收）。
      // $.post(
      //   "https://apif.java.crmeb.net/api/front/index?a=100&b=200",
      //   { username: "小王", password: 123 },
      //   (data) => {
      //     console.log(data);
      //   }
      // );

      // 以上两个请求是无法设置请求头的，也无法修改请求方式。如有需要，请使用通用请求。
      // $.ajax({参数就是配置对象});
      $.ajax({
        url: "https://apif.java.crmeb.net/api/front/index?a=100&b=200",
        method: "GET", // "GET/POST/PUT/DELETE"
        headers: {
          "content-type": "application/x-www-form-urlencoded", // 设置请求体参数的编码格式。默认的编码格式是application/x-www-form-urlencoded，它这种格式会将参数{键:值, 键:值}转化为 键=值&键=值得形式，转化格式是为了方便服务器接收。符合服务器格式，否则服务器无法接收这个参数。application/json它会将数据转化为json字符串得形式发送给服务器。
        },
        data: {
          username: "小明",
          password: 123456,
        },
        success: (data) => {
          console.log(data); // 请求成功得回调函数
        },
        error: (err) => {
          console.log(err); // 请求失败得回调函数
        },
      });

    </script>
  </body>
</html>
